<template>
	<view class="post-actions">
		<view class="post-actions-item" @click.stop="dropLike(data)">
			<u-icon :name="data.isLiked==1?'heart-fill':'heart'" :color="data.isLiked==1?'#ff5a5f':'#666'" size="24"></u-icon>
			<text class="post-actions-item-text">{{data.likeCount?data.likeCount:'点赞'}}</text>
		</view>
		<view class="post-actions-item" @click.stop="onDetail(data,true)">
			<u-icon name="chat" size="24" color="#666"></u-icon>
			<text class="post-actions-item-text">{{data.commentCount?data.commentCount:'评论'}}</text>
		</view>
		<view class="post-actions-item" @click.stop="dropCollect(data)">
			<u-icon :name="data.isCollected?'star-fill':'star'" :color="data.isCollected?'#ff5a5f':'#666'" size="24"></u-icon>
			<text class="post-actions-item-text">{{data.collectCount?data.collectCount:'收藏'}}</text>
		</view>
		<view class="post-actions-item" @click.stop="shareWx(data)">
			<u-icon name="share" size="24" color="#666"></u-icon>
			<text class="post-actions-item-text">{{data.repostCount?data.repostCount:'转发'}}</text>
		</view>
	</view>
</template>

<script>
	import { postClientLike ,postCancelLike ,postClientCollect,postCancelCollect} from '@/request/api.js';
	export default {
		name:"common-post-actions",
		props:{
			data:{ //	当前选中的index
				type:Object,
				default:1
			},
			showLike:{
				type:Boolean,
				default:true
			},
			showComment:{
				type:Boolean,
				default:true
			},
			showCollect:{
				type:Boolean,
				default:true
			},
			showShare:{
				type:Boolean,
				default:true
			}
		},
		data() {
			return {
				
			};
		},
		methods:{
			onDetail(data,isScorll){
				this.$emit('onDetail',data,isScorll)
			},
			setLike(is_like,index) {
				this.data.likeCount = is_like ? Number(this.data.likeCount) + 1 : Number(this.data.likeCount) - 1;
				this.data.isLiked = is_like ? 1 : 0;
			},
			dropLike(item){
				let targetLikedStatus = item.isLiked === 0 ? 1 : 0;
				console.log("targetLikedStatus",targetLikedStatus);
				
				this.setLike(targetLikedStatus === 1);
			
				let params = { postId:item.id, userId:item.userId };
				const apiCall = targetLikedStatus === 1 ? postClientLike(params) : postCancelLike(params);
			
				apiCall.then(res=>{
					if(res.data.code==500){
						this.setLike(targetLikedStatus === 0);
						uni.showToast({
							title: targetLikedStatus === 1 ? "点赞失败" : "取消点赞失败",
							icon: 'none',
						})
					}
				}).catch(() => {
					this.setLike(targetLikedStatus === 1);
					uni.showToast({ title: "网络错误，请稍后重试", icon: 'none' });
				})
			},
			setCollect(is_collect,index) {
				this.data.collectCount = is_collect ? Number(this.data.collectCount) + 1 : Number(this.data.collectCount) - 1;
				this.data.isCollected = is_collect ? 1 : 0;
			},
			dropCollect(item,index){
				let targetCollectedStatus = item.isCollected === 0 ? 1 : 0;
			
				this.setCollect(targetCollectedStatus === 1);
				
				const apiCall = targetCollectedStatus === 1 ? postClientCollect(item.id) : postCancelCollect(item.id);
			
				apiCall.then(res=>{
					if(res.data.code==500){
						this.setCollect(targetCollectedStatus === 0);
						uni.showToast({
							title: targetCollectedStatus === 1 ? "收藏失败" : "取消收藏失败",
							icon: 'none',
						})
					}
				}).catch(() => {
					this.setCollect(targetCollectedStatus === 1);
					uni.showToast({ title: "网络错误，请稍后重试", icon: 'none' });
				})
			},
			shareWx(item) {
				uni.share({
					provider: "weixin",
					scene: "WXSceneSession",
					type: 0,
					href: "分享链接",
					title: item.nickName,
					summary: item.content,
					imageUrl: item.avatar,
					success: function (res) {},
					fail: function (err) {}
				});
			}
		}
	}
</script>

<style lang="scss">
.post-actions{
	display: flex;
	color: #787878;
	justify-content: space-around;
	padding: 10rpx 0;
	font-size: 24rpx;
	margin-top: 15rpx;
	.post-actions-item{
		display: flex;
		align-items: center;
		&-text{
			min-width: 40rpx;
			text-align: center;
		}
	}
	.image{
		width: 38rpx;
		margin-right: 10rpx;
	}
}
</style>